<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		
		<style type="text/css">
			
			*{
				margin: 0;
				padding: 0;
			}
			#moveArea{
				width:200px;
				height:200px;
				border:2px solid;
			}
			
			#showMsg{
				margin:20px 0;
				width:200px;
				height:20px;
				border:2px solid;
			}
		</style>
		
		
		<script type="text/javascript">
			
			window.onload=function(){
				
				//获取moveArea、showMsg
				var moveArea=document.getElementById("moveArea");
				var showMsg=document.getElementById("showMsg");
			
				//给moveArea绑定事件	
				moveArea.onmousemove=function(move){
					//形参move接收浏览器传递过来的事件对象（实参）
					var x=move.clientX;
					var y=move.clientY;
					
					
					
					showMsg.innerHTML="x="+x+",y="+y

				};
			
				
				
				
			};
			
			
		</script>
	</head>
	<body>
		
		<div id="moveArea"></div>
		<div id="showMsg"></div>
		
	</body>
</html>
